import { Route } from '@angular/router';
import { ParentComponent } from './parent.component';
import { ChildAComponent } from './children/child-a.component';
import { ChildBComponent } from './children/child-b.component';
import { GrandchildAComponent } from './grandchildren/grandchild-a.component';
import { GrandchildBComponent } from './grandchildren/grandchild-b.component';
import { GrandchildCComponent } from './grandchildren/grandchild-c.component';
import { Animal } from './animal';
import { EnvironmentInjectorComponent } from './environment-injector.component';

export const routes: Route[] = [
  {
    path: '',
    component: EnvironmentInjectorComponent,
    children: [
      {
        path: '',
        component: ParentComponent,
        providers: [
          { provide: Animal, useValue: new Animal('🐑') },
        ],
        children: [
          {
            path: '',
            component: ChildAComponent,
            outlet: 'left',
            providers: [
              {
                provide: Animal,
                useValue: new Animal('🐬'),
              },
            ],
            children: [
              {
                path: '',
                component: GrandchildAComponent,
                providers: [
                  {
                    provide: Animal,
                    useValue: new Animal('🐧'),
                  },
                ],
              },
            ],
          },
          {
            path: '',
            component: ChildBComponent,
            providers: [
              {
                provide: Animal,
                useValue: new Animal('🐳'),
              },
            ],
            outlet: 'right',
            children: [
              {
                path: '',
                component: GrandchildBComponent,
                outlet: 'left',
                providers: [
                  {
                    provide: Animal,
                    useValue: new Animal('🦚'),
                  },
                ],
              },
              {
                path: '',
                component: GrandchildCComponent,
                outlet: 'right',
                providers: [
                  {
                    provide: Animal,
                    useValue: new Animal('🦉'),
                  },
                ],
              },
            ],
          },
        ],
      },
    ],
  },
];

export default routes;
